<template>
	<view class="page-box">
		<view class="all-number-box">
			<text>团队总人数(人)/团队消费金额(元)</text>
			<text class="all-num-text-box">{{money.all?money.all:0}}/{{money.all_consume?money.all_consume:0}}</text>
		</view>
		<view class="member-item-box first-box">
			<view class="member-item-title">
				一级成员(人)/一级团队总消费金额(元)
			</view>
			<view class="member-item-value">
				{{money.one?money.one:0}}/{{money.one_consume?money.one_consume:0}}
			</view>
		</view>
		<view class="member-item-box second-box">
			<view class="member-item-title">
				二级成员(人)/二级团队总消费金额(元)
			</view>
			<view class="member-item-value">
				{{money.two?money.two:0}}/{{money.two_consume?money.two_consume:0}}
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
        money:{},
			}
		},
		onShow(){
			this.getTeamInfo()
		},
		methods: {
			getTeamInfo(){
				this.$http.post('api/bonus/myTeam').then((res)=>{
					let data = res.data
          this.money = data
				}).catch((err)=>{

				})
			}
		}
	}
</script>

<style>
/* .page-box{
	width: 100%;
} */
.all-number-box{
	width: 100%;
	height: 164px;
	padding-top: 20px;
	background-color: #010101;
	display: flex;
	flex-direction: column;
	align-items: center;
	color: #8E8E8E;;
}
.all-num-text-box{
	margin-top: 24px;
	font-size: 24px;
	font-family: PingFangSC-Medium, PingFang SC;
	font-weight: 600;
	color: #fff;
}
.member-item-box{
	position: absolute;
	left: 16px;
	width: calc(100% - 32px);
	height: 96px;
	background: #FFFFFF;
	border-radius: 16px;
	display: flex;
	flex-direction: column;
	align-items: center;
	padding-top: 16px;
	box-sizing: border-box;
}
.first-box{
	top:132px;
}
.second-box{
	top:244px;
}
.thirdly-box{
	top:356px;
}
.member-item-title{
	font-size: 12px;
	font-family: PingFangSC-Medium, PingFang SC;
	font-weight: 500;
	color: #8E8E8E;
}
.member-item-value{
	margin-top: 16px;
	font-size: 24px;
	font-family: PingFangSC-Medium, PingFang SC;
	font-weight: 500;
	color: #020202;
}
</style>
